<% @page_title = @ps.name

@nics = @ps.nics
@connected_subnets = @ps.connected_subnets
@connectable_subnets = @ps.project.private_subnets_dataset.exclude(id: @ps.connected_subnets.map(&:id)).all

perm_checks = {
  "Firewall:view" => Firewall.where(id: @ps.firewalls.map(&:id)),
  "PrivateSubnet:view" => PrivateSubnet.where(id: @connected_subnets.map(&:id))
}

ps_path = "#{@project_data[:path]}#{@ps.path}"

viewable_fws, viewable_subnets =
  perm_checks.map do |perm, ds|
    dataset_authorize(ds, perm).select_hash(:id, Sequel.as(true, :v)).transform_keys! { UBID.from_uuidish(it).to_s }
  end %>

<%== part(
  "components/page_header",
  breadcrumbs: [
    %w[Projects /project],
    [@project_data[:name], @project_data[:path]],
    ["Private Subnet", "#{@project_data[:path]}/private-subnet"],
    [@ps.name, "#"]
  ],
  right_items: [part("components/ps_state_label", state: @ps.display_state, extra_class: "text-md")]
) %>

<div class="grid gap-6">
  <!-- Detail Card -->
  <%== part(
    "components/kv_data_card",
    data: [
      ["ID", @ps.ubid],
      ["Name", @ps.name],
      ["Location", @ps.display_location],
      ["IPv6 block", @ps.net6.to_s],
      ["IPv4 block", @ps.net4.to_s]
    ]
  ) %>
  <!-- Nic List -->
  <%== part(
    "components/table_card",
    title: "Attached VMs",
    headers: ["VM", "Private IPv4", "Private IPv6"],
    empty_state: "No VM attached",
    rows:
      @nics.map do |nic|
        [
          [
            (
              if nic.vm
                [nic.vm.name, { link: "#{@project_data[:path]}#{nic.vm.path}" }]
              else
                "-"
              end
            ),
            [nic.private_ipv4_address, { copyable: true }],
            [nic.private_ipv6_address, { copyable: true }]
          ],
          { id: "nic-#{nic.ubid}" }
        ]
      end
  ) %>
  <!-- Attached Firewall List -->
  <%== part(
    "components/table_card",
    title: "Attached Firewalls",
    headers: %w[Name Description],
    empty_state: "No firewall attached",
    rows:
      @ps.firewalls.map do |fw|
        [
          [
            (
              if viewable_fws[fw.ubid]
                [fw.name, { link: "#{@project_data[:path]}#{fw.path}" }]
              else
                fw.name
              end
            ),
            fw.description
          ],
          { id: "fw-#{fw.ubid}" }
        ]
      end
  ) %>
  <!-- Connected Private Subnets List -->
  <div class="md:flex md:items-center md:justify-between pb-2 lg:pb-4">
    <div class="min-w-0 flex-1">
      <h3 class="text-2xl font-bold leading-7 text-gray-900 sm:truncate sm:text-2xl sm:tracking-tight">
        Connected Subnets
      </h3>
    </div>
  </div>
  <div class="overflow-hidden rounded-lg shadow ring-1 ring-black ring-opacity-5 bg-white divide-y divide-gray-200">
    <table class="min-w-full divide-y divide-gray-300">
      <thead class="bg-gray-50">
        <tr>
          <th scope="col" class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-6">Name</th>
          <th scope="col" class="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"></th>
        </tr>
      </thead>
      <tbody class="divide-y divide-gray-200 bg-white">
        <% @connected_subnets.each do |subnet| %>
          <tr>
            <td class="whitespace nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-6" scope="row">
              <% if viewable_subnets[subnet.ubid] %>
                <a href="<%= "#{@project_data[:path]}#{subnet.path}" %>" class="text-orange-600 hover:text-orange-700"><%= subnet.name %></a>
              <% else %>
                <%= subnet.name %>
              <% end %>
            </td>
            <td
              id="cps-delete-<%= subnet.ubid %>"
              class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm font-medium sm:pr-6"
            >
              <%== part(
                "components/delete_button",
                url: "#{ps_path}/disconnect/#{subnet.ubid}",
                confirmation_message: "Are you sure to disconnect?",
                redirect: ps_path,
                method: "POST",
                text: "Disconnect"
              ) %>
            </td>
          </tr>
        <% end %>
        <tr>
          <td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-6" scope="row">
            <%== part(
              "components/form/select",
              name: "connected-subnet-id",
              label: "",
              placeholder: "Pick a subnet to connect",
              options: @connectable_subnets.map { |s| [s.ubid, s.name] },
              attributes: {
                form: "form-connect-subnet"
              }
            ) %>
          </td>
          <td class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm font-medium sm:pr-6">
            <form action="<%= "#{ps_path}/connect" %>" role="form" method="POST" id="form-connect-subnet">
              <%== csrf_tag("#{ps_path}/connect") %>
              <%== part("components/form/submit_button", text: "Connect") %>
            </form>
          </td>
        </tr>
      </tbody>
    </table>
  </div>
  <!-- Delete Card -->
  <% if has_permission?("PrivateSubnet:delete", @ps.ubid) %>
    <div class="overflow-hidden rounded-lg shadow ring-1 ring-black ring-opacity-5 bg-white divide-y divide-gray-200">
      <div class="px-4 py-5 sm:p-6">
        <div class="sm:flex sm:items-center sm:justify-between">
          <div>
            <h3 class="text-base font-semibold leading-6 text-gray-900">Delete private subnet</h3>
            <div class="mt-2 text-sm text-gray-500">
              <p>This action will permanently delete this private subnet. Deleted subnet cannot be recovered. Use it
                carefully.</p>
            </div>
          </div>
          <div class="mt-5 sm:ml-6 sm:mt-0 sm:flex sm:flex-shrink-0 sm:items-center">
            <%== part("components/delete_button", confirmation: @ps.name, redirect: "#{@project_data[:path]}/private-subnet") %>
          </div>
        </div>
      </div>
    </div>
  <% end %>
</div>
